<!DOCTYPE html>
<html>

    <head>
        <title>avalon入门</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="avalon.js" type="text/javascript"></script>
        <script>
            var vm = avalon.define({
                $id: 'test',
                number: 1,
                add: function () {
                    vm.number++
                },
                del: function () {
                    vm.number--
                }
            });

        </script>
        <style>
            .hover{
                background-color:red;
            }
        </style>
    </head>

    <body>

        <div ms-controller="test">
            <button  ms-hover="hover : number>1">{{number}}</button>


            <button ms-on-click="add">add</button>
            <button ms-on-click="del">del</button>
        </div>
    </body>

</html>
